import type { Size } from "@/plugins/element"

export const useAppStore = defineStore(
  "app",
  () => {
    const state = ref<{
      size: Size
      fullScreen: boolean
      sidebar: {
        opened: boolean
      }
      lang: string
    }>({
      sidebar: {
        opened: false
      },
      fullScreen: false,
      size: "default",
      lang: "zh-cn"
    })

    const sidebar = computed(() => state.value.sidebar)
    const size = computed(() => state.value.size)
    const lang = computed(() => state.value.lang)
    const toggleSidebar = () => {
      state.value.sidebar.opened = !state.value.sidebar.opened
    }

    const toggleFullScreen = (value: boolean) => {
      state.value.fullScreen = value
    }

    const setSize = (size: Size) => {
      state.value.size = size
    }

    const setLang = (lang: string) => {
      state.value.lang = lang
    }

    return {
      state,
      sidebar,
      size,
      lang,
      toggleSidebar,
      toggleFullScreen,
      setSize,
      setLang
    }
  },
  {
    persist: {
      storage: window.localStorage, // 指定持久化方式
      pick: ["state"] // 指定要持久化的数据
    }
  }
)
